<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <title>{$Think.config.Paykey.title}</title>
    <script src="__CDN__/assets/js/jquery.min.js"></script>
    <script src="https://wx.gtimg.com/wxpay_h5/fingerprint2.min.1.5.1.js"></script>
    <style>
    body{
        margin: 0px;
        padding: 0px;
        font-size: 16px;
        line-height: 38px;
    }
	#top{
        height: 40px;
        background-color: #000;
        text-align: center;
        line-height: 40px;
        color:#fff;
        font-size: 20px;
	}

    #content{
        border: solid 1px;
        padding: 10px;
        margin: 20px;
    }
 
    .fl{
        float: left;
        text-align: right;
        min-width: 25%;
    }
    .fontred_small{
        font-size: 14px;
        color: #cc0000;
        padding-left:5%;
    }
    .fontred_big{
        color: #cc0000;
        font-size: 18px;
    }
    #btn{
        text-align: center;
    }
    #pay_btn{
		margin-top: 20px;
        margin-bottom: 10px;
        padding-left: 20px;
        padding-right: 20px;
    	border: solid;
        background-color: #0099ff; 
        color:#fff;
        font-size: 18px;
        line-height: 30px;
    }
	</style>
</head>
<body>
<div id="top">{$Think.config.Paykey.title}</div>
<div id="content">
    <div class="contr"><div class="fl">游 戏 ID：</div>{$order_info.uid}</div>
    <div class="contr"><div class="fl">收单金额：</div><span class="fontred_big">{$order_info.orderamount}</span>
    	<input type="hidden" name="totalAmount" value="{$order_info.orderamount}">元
    </div>
    <div class="contr"><div class="fl">支付方式：</div><span class="fontred_big">{$order_info.payment}</span>
        <input type="hidden" name="payType" {if condition="$order_info.payment == '支付宝'"} value="alipay"{elseif condition="$order_info.payment =='微信'"/}value="wechat"{/if} >
    </div>
    <div class="contr"><div class="fl">订单编号：</div>{$order_info.orderID}
    	<input type="hidden" name="outTradeNo" value="{$order_info.orderID}">
    </div>
    <div class="contr"><div class="fl">交易标题：</div>{$goods_info.goodsname}
    	<input type="hidden" name="subject" value="{$goods_info.goodsname}">
    	<input type="hidden" name="remark" value="">
    </div>
	<div id="timer" class="fontred_small"></div>
    <div class="contr fontred_small">请核对订单信息是否正确</div>
    <div id="btn"><button onclick="pay()" id="pay_btn">提交支付</button></div>
</div>


<script>
	var validtime = {$order_info.addtime} + 600000;//下订单有效时间13位
	const payUrl = "{$Think.config.Paykey.url}"; //支付接口地址
	var payData={
        shopNo:"{$Think.config.Paykey.merchant}",//店铺编号，必填1711041090(重庆掌驰科技有限公司) 1711291096(大晋棋牌，下级门店) 1709051059(支付宝测试商家）

        //seceneInfo是微信特殊需要的，场景信息，支付宝不需要这个信息，传入会被忽略
        "seceneInfo.type":"Wap",//Wap,IOS,Android
        "seceneInfo.wap_url":"{$Think.config.GameDB.http}",//WAP网站URL地址,当seceneInfo.type为Wap时，这个字段不是回调地址，一般填写客户的官网地址
        "seceneInfo.wap_name":"支付",//WAP 网站名,当seceneInfo.type为Wap时，一般填写客户的官网网站名

    };
	
	var fp=new Fingerprint2();
	fp.get(function(result){
		payData.fingerprint = result;
	});
	
    function pay()
    {
        payData.totalAmount = $('input[name="totalAmount"]').val();
        payData.payType = $('input[name="payType"]').val();
        payData.outTradeNo = $('input[name="outTradeNo"]').val();
        payData.subject = $('input[name="subject"]').val();
        payData.remark = $('input[name="remark"]').val();
        payData.returnUrl = "{$Think.config.Paykey.result}";
//        payData.userIp = "{$order_info.ip}";

	    var timestamp = (new Date()).valueOf();//当前时间13位
	    if(timestamp>validtime){
	    	$('#pay_btn').attr("disabled", true);
	    	alert('订单支付有效时间已过，请重新下单');
			return false;
	    }

        if(payData.outTradeNo == '' || payData.outTradeNo == undefined){
    		alert('订单编辑js中不见了');
    		return false;
    	} 
        //按钮disable，避免重复提交，实际这里的处理客户端自由选择
        $('#pay_btn').attr("disabled", true);

        //payUrl是固定的，payData就是提交的支付信息，
        // 提交后，微信返回一个url，跳转过去即拉起收银台；
        // 支付宝返回一个表单(htmlText)，提交返回的表单即拉起收银台
        $.post(payUrl,payData).done(function(data) {
            //如果为100，则表示预下单成功了，跳转微信或支付宝的官方支付页面即可
            if (data.msgcode === "100") {
                if(data.msg.payType == "wechat")
                {
                    //微信返回的是url地址，跳转过去
                    window.location.href = "https://www.darlingpage.com/go/toWechat.html?mwebUrl="+encodeURI(data.msg.mwebUrl);
//                    window.location.href = data.msg.mwebUrl;
                }
                //支付宝返回htmlText,含form表单，如这个表单进行跳转
                else if(data.msg.payType == "alipay")
                {
                    const div = document.createElement('div');
                    div.innerHTML = data.msg.htmlText;
                    document.body.appendChild(div);
                    document.forms.punchout_form.submit();
                }
            } else {
                //预下单失败，各种报错信息，在这里提示，demo只是简单alert一下
                alert("交易失败:"+data.msg);
				//按钮恢复，实际这里的处理客户端自由选择
                $('#pay_btn').removeAttr("disabled");
            }
        }).fail(function() {
        	alert("请求失败:"+data.msg);
        	$('#pay_btn').removeAttr("disabled");
        });
    }
    
    var timepage = (new Date()).valueOf();//当前时间13位
    var maxtime = parseInt((validtime-timepage)/1000); //有效时间 - 当前时间 ＝ 还剩余多少有效时间  
	function CountDown() {
		if (maxtime >= 0) {
			minutes = Math.floor(maxtime / 60);
			seconds = Math.floor(maxtime % 60);
			msg = "剩余支付时间：" + minutes + "分" + seconds + "秒";
			document.all["timer"].innerHTML = msg;
			--maxtime;
		} else{
			clearInterval(timer);
			$('#pay_btn').attr("disabled", true);
			alert("订单支付有效时间已过，请重新下单");
		}
	}
	timer = setInterval("CountDown()", 1000);  
</script>


</body></html>